<script type="text/x-template" id="hooks-detail-errors-table-view">
<div>
    <cly-datatable-n 
        class="cly-vue-hook-table is-clickable hook-error-table"
        :rows="tableRows" :resizable="false" >
        <template v-slot="scope">
            <!-- <el-table-column fixed label="Tracked data" sortable="true"  min-width="100" :class="is-clickable">
                <template slot-scope="scope">
                    <div v-html="scope.row.a"></div>
                </template>
            </el-table-column>  -->
            <el-table-column type="expand" class="hook-log-column">
                <template  v-slot="props">
                    <div class="bu-is-flex bu-is-flex-direction-column hook-logs-card">
                        <!-- {{props.row.e}} -->
                        <div class="bu-level bu-mb-5">
                            <div class="bu-level-left text-medium font-weight-bold">{{i18n("hooks.stacktrace")}}</div>
                            <div class="bu-level-right is-clickable" style="text-decoration: underline;cursor: pointer;" 
                                @click="downloadLog(props.row.e, props.row.timestamp)">{{i18n("hooks.download-stacktrace")}}</div>
                        </div>
                        <pre  class="bu-is-flex bu-flex-wrap">
                            <span class="hook-log-lines-bar">{{props.row._lines}}</span>
                            <code class="hook-log-code">{{props.row.e}}</code>
                        </pre>
                    </div>
                </template>
            </el-table-column>

            <el-table-column  :label="i18n('hooks.time')" sortable="true">
                <template slot-scope="scope" sortable="true">
                    <div>{{scope.row.timestamp_string}}</div>
                </template>
            </el-table-column>
            <el-table-column align="left"  :label="i18n('hooks.action-step')"  sortable="true">
                <template slot-scope="scope" sortable="true">
                    <div>
                        {{scope.row.effectStep}} 
                    </div>
                </template>
            </el-table-column> 
            
            <el-table-column :label="i18n('hooks.trigger-data')"  width="352"  sortable="true"  class="params-column">
                <template slot-scope="scope" sortable="true">
                    <div>
                        <pre class='code-pre-line'>{{scope.row._originalInput}} </pre>
                    </div>
                </template>
            </el-table-column> 
            
            <el-table-column  :label="i18n('hooks.action-data')" width="352" sortable="true"  >
                <template slot-scope="scope" sortable="true">
                    <div>
                        <pre class='code-pre-line'>{{scope.row.params}} </pre>
                    </div>
                </template>
            </el-table-column> 
      
           
        </template>

    </cly-datatable-n>
</div>
</script>